import { computed, reactive } from "vue";

interface User {
  id: string;
  name: string;
  role: "TEACHER" | "STUDENT";
  account: string;
}

export function useUserStore() {
  const user = reactive<User>({
    id: "",
    name: "",
    role: "STUDENT",
    account: "",
  });

  const userInfo = computed(() => {
    const user = localStorage.getItem("user");
    if (user) {
      return JSON.parse(user);
    }
    return null;
  });

  function setUserInfo(user: User) {
    user.account = user.account;
    user.id = user.id;
    user.name = user.name;
    user.role = user.role;
    localStorage.setItem("user", JSON.stringify(user));
  }

  return {
    user,
    userInfo,

    setUserInfo,
  };
}
